/*
 * @Author: your name
 * @Date: 2021-05-12 22:57:49
 * @LastEditTime: 2021-05-12 23:39:17
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \react-execl\src\Aechart.js
 */
import './App.css';
import {  Component  } from 'react';
import ReactEcharts from 'echarts-for-react';
import { Row, Col } from 'antd';

class Aechart extends Component{
    constructor(props){
        super(props)
        const { optionArray, ColNum } = props
        this.state = {
            optionArray:optionArray,
            ColNum: ColNum || 24
        }
    }
    componentWillReceiveProps(props) {
        const { optionArray, ColNum } = props
        this.setState({optionArray: optionArray,ColNum: ColNum});
    }
    render(){
        return <Row>
        {
            
                this.state.optionArray.map((item,index)=>{
                    return (
                            
                        <Col span={this.state.ColNum} key={`${item}${index}-op`}>
                            <ReactEcharts  className={['pie','piecircular'].includes(item.key)?'pie-height':''}  
                            option={Object.assign({},item,{key:`${index}-optione`}) }  />
                        </Col>
                    )
                })
            
        }
        </Row>
      
    }
}

export default Aechart